<div class="layui-tab layui-tab-brief" lay-filter="demo" lay-allowclose="true">
    <ul class="layui-tab-title">
        <li class="layui-this" lay-id="11">版块列表</li>
    </ul>
    <div class="layui-tab-content">
        <div class="layui-tab-item layui-show">
            <div class="layui-inline" style="display:inline-block">
                <input class="layui-input" type="text" name="forum_s" id="forum_s" placeholder="请输入版块名称" autocomplete="off" >
            </div>
            <span><button class="layui-btn" data-type="reload" id="select">查询</button></span>
            <div class="layui-btn-group demoTable" style="float:right;margin-bottom: 0;">
                <button class="layui-btn site-demo-active" data-type="tabAdd" id="forum_add"><i class="layui-icon">&#xe608;</i> 添加</button>
                <button class="layui-btn" data-type="getCheckData" id="delete"><i class="layui-icon">&#xe640;</i>删除</button>
            </div>
            <div><table id = "forumInfo" lay-filter="forumInfo"></table></div>
        </div>
    </div>
</div>
<script>
    forum.getForumInfo();
    forum.getForumHandel();
    forum.getForumUpdate();
</script>
<script>
    layui.use('element', function(){
        var $ = layui.jquery
            ,element = layui.element; //Tab的切换功能，切换事件监听等，需要依赖element模块
        //触发事件
        var active = {
            tabAdd: function(){
                //新增一个Tab项
                element.tabAdd('demo', {
                    title: '版块添加'
                    ,id: new Date().getTime() //实际使用一般是规定好的id，这里以时间戳模拟下
                    ,content: '<iframe src="/admin/forumadd" id="myiframe" width="1200" height="600" frameborder="0" scrolling="auto"></iframe>'
                })
            }
        };

        $('#forum_add').on('click', function(){
            var othis = $(this), type = othis.data('type');
            active[type] ? active[type].call(this, othis) : '';
        });
    });
</script>


